<template>
  <div class="App">
    <h1>我是App{{msg}}</h1>
    <button @click="msg='react'">修改msg</button>
    <button @click="count++">修改count</button>
    <button @click="$destory()">销毁我</button>
     <Count :count="count"/>
  </div>
</template>

<script>
import Count from '@/components/Count';


export default {
  name: 'App',
  data(){
    return {
      msg:"vue",
      count:0,
    }
  },
  components: {
    Count,
  },
  // 初始化阶段
  beforeCreate(){
    console.log("------beforeCreate");
  },
  created(){
    console.log("--------created");
  },
  beforeMount(){
    console.log("---------beforeMount");
  },
  mounted(){
    console.log("--------mounted");
  },
  beforeUpdate(){
    console.log("------beforeUpdate");
  },
  updated(){
    console.log("--------updated");
  },
   beforeDestroy() {
    console.log("-----beforeDestroy");
  },
  destroyed() {
    console.log("------destroyed");
  },

  

  

}
</script>



